<template>
  <div id="about">
    <div v-if="!aboutArticle" class="h-500 l-h-500">
      <h2 class="text-align-center">暂无关于文章</h2>
      <h2 class="text-align-center">请登录管理员添加标题为《关于》的文章</h2>
    </div>
    <div v-else class="ql-editor w-800 article" v-html="aboutArticle"></div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      aboutArticle: null
    }
  },
  created() {
    this.getAboutArticle()
  },
  methods: {
    async getAboutArticle() {
      let res = await this.api.get('/client/getAboutArticle')
      if(res.code == 0 && res.data !== null) this.aboutArticle = res.data.articleContent
    }
  },
}
</script>

<style lang="scss">
#about {
  padding-top: 80px;
  .article {
    margin: 0 auto;
  }
}
</style>